<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <link rel="stylesheet" href="/${BasePath}/static/mobile/css/base.css" />
    <link rel="stylesheet" href="/${BasePath}/static/mobile/css/style.css" />
    <link rel="stylesheet" href="/${BasePath}/static/mobile/css/swiper.min.css" />
    <link rel="stylesheet" href="/${BasePath}/static/mobile/css/ydui.css" />
    <title>商城</title>  
</head>
<body class="bcWhite">
    <input type="hidden" id="active" value="sc">
	<div class="wrap">
	<div class="mainTop">
		<div class="mainIcon">
			<div class="icon">
				<a href="https://www.mhwzy.cn/${BasePath}/user/register"><i class="icon-shopcart fs50"></i></a>
				<div>成为卖方</div>
			</div>	
			<div class="icon">
			    <a href="http://188.131.236.72:8080/shop-show/user/register.html"><i class="icon-shopcart-outline fs50"></i></a>
				<div>成为买方</div>
			</div>
			<div class="icon">
			    <a href="/${BasePath}/free/yjfk"><i class="icon-feedback fs50"></i></a>
				<div>给我留言</div>
			</div>
		</div>
	</div>
	<div class="mainBoard">
     <img src="/${BasePath}/static/mobile/img/xckl.png">
	</div>
    <section class="g-scrollview" id="J_List">

        <article class="m-list list-theme4" id="J_ListContent">
        </article>

    </section>	
	
		
		<!--导航栏-->
      <#include "/common/foot.html">
       
	</div>
</body>
<script type="text/javascript" src="/${BasePath}/static/mobile/js/ydui.flexible.js"></script>
<script type="text/javascript" src="/${BasePath}/static/mobile/js/ydui.js"></script>
<script src="http://static.ydcss.com/libs/arttemplate/template.js"></script>
<script id="J_ListHtml" type="text/html">
    {{each list as data}}
            <a href="/${BasePath}/free/{{data.id}}/index" class="list-item">
                <div class="list-img">
                    <img src="{{data.shopLogo}}" data-url="{{data.shopLogo}}">
                </div>
                <div class="list-mes">
                    <h3 class="list-title">{{data.shopName}}</h3>
                    <div class="list-mes-item">
                        <div>
                            <span >联系电话：{{data.phone}}</span>
                            <div class="words">{{data.synopsis}}</div>
                        </div>
                        <div><span class="badge badge-primary">营业中</span></div>
                    </div>
                </div>
            </a>   
    {{/each}}
</script>
<script>
    /* 通过自定义的方法获取数据【通常是需要定义变量当前第几页page，和每页请求的记录数pageSize】 */
    var page = 1, pageSize = 6;

    $('#J_List').infiniteScroll({
        pageSize: pageSize,
        initLoad: true,
        loadingHtml: '<img src="http://static.ydcss.com/uploads/ydui/loading/loading10.svg"/>', /* 当然也可以<img src="../img/loading.gif" /> */
        doneTxt:'',
        loadListFn: function () {
            var def = $.Deferred();

            /* 通过自定义的方法获取数据 */
            $.ajax({
                url: '/${BasePath}/free/queryShopInfoPage',
                dataType: 'json',
                data: { page: page, limit: pageSize},
                success: function (ret) {
                    /* 假设ret.list为后端返回的列表数组 */

                    /* 用你喜欢的方法将获取到的数据拼接成HTML，然后插入；*/
                    /* 建议使用模板引擎，示例使用artTemplate；https://github.com/aui/artTemplate */
                     var html = template('J_ListHtml', {list: ret.data});
                    $('#J_ListContent').append(html);

                    /* 获取数据，并插入页面后，调用resole，并传入当前获取的记录列表集合 */
                    def.resolve(ret.data);

                    /* 页码自增1 */
                    ++page;
                }
            });

            return def.promise();
        }
    }); 
</script>

</html>